<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
        <title>班级管理</title>
        <include file='Layout:ins_css' />
        <style type="text/css">
            #addBtn {
                float: right;
                margin: -7px -6px 9px;
            }
            .price-div {
                /*float: left;*/
                margin: 12px 0px 6px 16px;
            }

            .price-div input {
                width: 8em;
                float: left;
                margin-right: 6px;
            }

            .price-div p {
                line-height: 25px;
                margin-right: 6px;
                float: left;
            }

            .price-div select {
                /*float: left;*/
                width: 60%;
                max-width: 16em;
                margin-right: 10px;
            }
            .cyf-form-group{
                margin-top: 10px;
                margin-bottom: 10px;

            }
            .staff {
                margin-top: 6px;
            }
            .nationality {
                margin-right: 15px;
            }
            div.dataTables_filter label input{
                width: 100%;
            }

        </style>
    </head>
    <body class="single">
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5>班级管理</h5>
                            <button class="btn btn-primary" id="addBtn">新增</button>
                        </div>
                        <div class="row s-row">
                            <div class="col-sm-12">
                                <div class="price-div">
                                    <form class="form-horizontal">
                                        <div class="form-group cyf-form-group">
                                            <div class="col-sm-4" style="margin-top: 10px; margin-bottom: 10px">
                                                <label style="float: left" class="col-sm-4 control-label cvbnm">学院: </label>
                                                <select class="form-control col-sm-" id="college_id" name="college_id" style="min-height: 35px">
                                                    <option value="0">全部</option>
                                                    <volist name="college_info" id="college_info">
                                                        <option value="{$college_info.sch_id}">{$college_info.sch_name}</option>
                                                    </volist>
                                                </select>
                                            </div>
                                            <div class="col-sm-4" style="margin-top: 10px; margin-bottom: 10px">
                                                <label style="float: left; margin-right: 13px" class="col-sm-4 control-label cvbnm">系: </label>
                                                <select class="form-control col-sm-" id="department_id" name="department_id" style="min-height: 35px">
                                                    <option value="0">全部</option>
                                                    <volist name="department_info" id="department_info">
                                                        <option value="{$department_info.dept_id}" pid="{$department_info.sch_id}"  style="display: none;">{$department_info.dept_name}</option>
                                                    </volist>
                                                </select>
                                            </div>
                                            <div class="col-sm-4" style="margin-top: 10px; margin-bottom: 10px">
                                                <label style="float: left;" class="col-sm-4 control-label cvbnm">专业: </label>
                                                <select class="form-control col-sm-" id="noun_id" name="noun_id" style="min-height: 35px">
                                                    <option value="0">全部</option>
                                                    <volist name="noun_info" id="noun_info">
                                                        <option value="{$noun_info.pro_id}" pid="{$noun_info.dept_id}"  style="display: none;">{$noun_info.pro_name}</option>
                                                    </volist>
                                                </select>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="ibox-content">
                            <table class="table table-striped table-bordered table-hover dataTables-example">
                                <thead>
                                <tr>
                                    <th width="20%">班级编号</th>
                                    <th width="20%">班级名称</th>
                                    <th width="20%">年级</th>
                                    <th width="20%">人数</th>
                                    <th width="20%">操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Modal 新增专业-->
        <div class="modal fade" id="AdNoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">新增专业</h4>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" id="form_add">
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属学院</label>
                                <select class="form-control poiu" id="sd_boss_add" name="sd_boss_add">
                                    <option value="0">请选择</option>
                                    <volist name="par_college" id="par_college">
                                        <option value="{$par_college.sch_id}">{$par_college.sch_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属系部</label>
                                <select class="form-control poiu" id="de_boss_add" name="de_boss_add">
                                    <option value="0">请选择</option>
                                    <volist name="par_department" id="par_department">
                                        <option value="{$par_department.dept_id}" pid="{$par_department.sch_id}" style="display: none;">{$par_department.dept_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属专业</label>
                                <select class="form-control poiu" id="noun_boss_add" name="noun_boss_add">
                                    <option value="0">请选择</option>
                                    <volist name="par_noun" id="par_noun">
                                        <option value="{$par_noun.pro_id}" pid="{$par_noun.dept_id}" style="display: none;">{$par_noun.pro_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group" style="display: none">
                                <label class="col-sm-3 control-label ">班级编号</label>
                                <div class="col-sm-7">
                                    <input type="text"  id="add_cla_id" name="add_cla_id" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">班级名称</label>
                                <div class="col-sm-7">
                                    <input type="text" id="add_cla_name" name="add_cla_name" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">所在年级</label>
                                <div class="col-sm-7">
                                    <input type="text" id="add_stu_grade" name="add_stu_grade" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">班级人数</label>
                                <div class="col-sm-7">
                                    <input type="text" id="add_cla_number" name="add_cla_number" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3  control-label " style="margin-top: 30px;">班级简介: </label>
                                <div class="col-sm-7">
                                    <textarea id="add_cla_intro" name="add_cla_intro" class="form-control  cyf-inpput" rows="" cols="" style="height: 150px;"></textarea>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" id="add_btn">保存</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- Modal 编辑专业-->
        <div class="modal fade" id="EditNoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">编辑专业</h4>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" id="form_edit">
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属学院</label>
                                <select class="form-control poiu" id="sd_boss_edit" name="sd_boss_edit">
                                    <option value="0">请选择</option>
                                    <volist name="par_college_edit" id="par_college_edit">
                                        <option value="{$par_college_edit.sch_id}">{$par_college_edit.sch_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属系部</label>
                                <select class="form-control poiu" id="de_boss_edit" name="de_boss_edit">
                                    <option value="0">请选择</option>
                                    <volist name="par_department_edit" id="par_department_edit">
                                        <option value="{$par_department_edit.dept_id}" pid="{$par_department_edit.sch_id}" style="display: none">{$par_department_edit.dept_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label cvbnm nationality">所属专业</label>
                                <select class="form-control poiu" id="noun_boss_edit" name="noun_boss_edit">
                                    <option value="0">请选择</option>
                                    <volist name="par_noun_edit" id="par_noun_edit">
                                        <option value="{$par_noun_edit.pro_id}" pid="{$par_noun_edit.dept_id}" style="display: none;">{$par_noun_edit.pro_name}</option>
                                    </volist>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">班级编号</label>
                                <div class="col-sm-7">
                                    <input type="text" readonly="readonly" id="edit_cla_id" name="edit_cla_id" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">班级名称</label>
                                <div class="col-sm-7">
                                    <input type="text" id="edit_cla_name" name="edit_cla_name" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">所在年级</label>
                                <div class="col-sm-7">
                                    <input type="text" id="edit_stu_grade" name="edit_stu_grade" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">班级人数</label>
                                <div class="col-sm-7">
                                    <input type="text" id="edit_cla_number" name="edit_cla_number" class="form-control removeData">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3  control-label " style="margin-top: 30px;">班级简介: </label>
                                <div class="col-sm-7">
                                    <textarea id="edit_cla_intro" name="edit_cla_intro" class="form-control  cyf-inpput" rows="" cols="" style="height: 150px;"></textarea>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" id="edit_btn">保存</button>
                    </div>
                </div>
            </div>
        </div>
        <include file='Layout:ins_js' />
        <script type="text/javascript">
            $(document).ready(function() {
                //自检
                check_index();

                sTable = $(".table").DataTable({
                    "fnServerParams": function(aoData) {
                        aoData.push({
                            'name': 'noun_id',
                            'value': $('select#noun_id option:selected').val()
                        });
                    },
                    "bAutoWidth":false,
                    "oLanguage": {
                        "sLengthMenu": "每页 _MENU_ ",
                        "sProcessing": "处理中...",
                        "sZeroRecords": "没有匹配结果",
                        "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
                        "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
                        "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
                        "sInfoPostFix": "",
                        "sSearch": "搜索:",
                        "sUrl": "",
                        "sEmptyTable": "表中数据为空",
                        "sLoadingRecords": "载入中...",
                        "sInfoThousands": ",",
                        "oPaginate": {
                            "sFirst": "首页",
                            "sPrevious": "上页",
                            "sNext": "下页",
                            "sLast": "末页"
                        },
                        "oAria": {
                            "sSortAscending": ": 以升序排列此列",
                            "sSortDescending": ": 以降序排列此列"
                        }
                    },
                    "sAjaxSource": "__URL__/class_manage_ShowDatatables", //调用php后台接口方法地址
                    "aoColumns": [{
                        'data': 'cla_id'
                    },{
                        'data': 'cla_name'
                    },{
                        'data': 'stu_gra'
                    },{
                        'data': 'cla_number'
                    },{
                        "data": null,
                        orderable: false,
                        render: function(data, type, row, meta) {
                            return '<a type="button" class="btn btn-success" href="#" onclick=editFromID(this) >编辑</a>|<a type="button" class="btn btn-danger" href="#" onclick=delFromID(this) >删除</a>'
                        }
                    }]
                });
            });
            //查询按钮
            $("select#college_id").change(function() {
                //console.log( $('select#college_id option:selected').val());
                var p_id = $("#college_id").val();
                $("#department_id option").hide();
                $('#department_id').val('0');
                $('option[pid=' + p_id + ']').show();
            });
            $("select#department_id").change(function() {
                //console.log( $('select#college_id option:selected').val());
                var p_id = $("#department_id").val();
                $("#noun_id option").hide();
                $('#noun_id').val('0');
                $('#noun_id option[pid=' + p_id + ']').show();
            });
            $("select#noun_id").change(function(){
                sTable.ajax.reload();
            });
            <!--------------   新增模态框相关     !----------------->
            //新增模态框 - 学院 选择事件-
            $('select#sd_boss_add').change(function () {
                var p_id = $("#sd_boss_add").val();
                $("#de_boss_add option").hide();
                $('#de_boss_add').val('0');
                $('option[pid=' + p_id + ']').show();
            });
            $('select#de_boss_add').change(function () {
                var p_id = $("#de_boss_add").val();
                $("#noun_boss_add option").hide();
                $('#noun_boss_add').val('0');
                $('option[pid=' + p_id + ']').show();
            });
            //新增模态框弹出
            $("#addBtn").on('click', function() {
                $("#AdNoModal").modal();
            });
            $("#add_btn").on('click', function() {
                var formData = $('#form_add').serializeArray();
                var postData = {};

                $(formData).each(function(i) {
                    postData[this.name] = this.value;
                });
                sil_loading();
                $.ajax({
                    type: "post",
                    url: "__URL__/add_class",
                    async: true,
                    data: postData,
                    dataType: 'json',
                    success: function(p) {
                        if(p.state) {
                            toastr.success(p.info);
                            $("#AdNoModal").modal('hide');
                            sTable.ajax.reload();
                        } else {
                            toastr.warning(p.info);
                        }
                        sil_reloading();
                    }
                });
            });
            <!--------------   编辑模态框相关     !----------------->
            //新增模态框 - 学院 选择事件-
            $('select#sd_boss_edit').change(function () {
                var p_id = $("#sd_boss_edit").val();
                $("#de_boss_edit option").hide();
                $('#de_boss_edit').val('0');
                $('#de_boss_edit option[pid=' + p_id + ']').show();
            });
            $('select#de_boss_edit').change(function () {
                var p_id = $("#de_boss_edit").val();
                $("#noun_boss_edit option").hide();
                $('#noun_boss_edit').val('0');
                $('#noun_boss_edit option[pid=' + p_id + ']').show();
            });
            //编辑模态框弹出
            function editFromID(obj) {
                var Obj = $(obj).parent().parent();
                var rowdata = sTable.row(Obj).data();
                $('#sd_boss_edit').val(rowdata.sch_id);
                $('#de_boss_edit').val(rowdata.dept_id);
                $('#noun_boss_edit').val(rowdata.pro_id);
                $('#edit_cla_id').val(rowdata.cla_id);
                $('#edit_cla_name').val(rowdata.cla_name);
                $('#edit_stu_grade').val(rowdata.stu_gra);
                $('#edit_cla_number').val(rowdata.cla_number);
                $('#edit_cla_intro').val(rowdata.cla_intro);
                $("#EditNoModal").modal();
            }
            $("#edit_btn").on('click', function() {
                var formData = $('#form_edit').serializeArray();
                var postData = {};

                $(formData).each(function(i) {
                    postData[this.name] = this.value;
                });
                sil_loading();
                $.ajax({
                    type: "post",
                    url: "__URL__/edit_class",
                    async: true,
                    data: postData,
                    dataType: 'json',
                    success: function(p) {
                        if(p.state) {
                            toastr.success(p.info);
                            $("#EditNoModal").modal('hide');
                            sTable.ajax.reload();
                        } else {
                            toastr.warning(p.info);
                        }
                        sil_reloading();
                    }
                });
            });
            function delFromID(obj) {
                var Obj = $(obj).parent().parent();
                var rowdata = sTable.row(Obj).data();
                swal({
                    title: '提示',
                    text: "确定要删除吗?",
                    type: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: '确定',
                    cancelButtonText: '取消'
                }).then(function(isConfirm) {
                    if(isConfirm) {
                        $.ajax({
                            type: "post",
                            url: "__URL__/delete_class",
                            async: true,
                            data: {
                                delete_cla_id: rowdata.cla_id,
                            },
                            dataType: 'json',
                            success: function(p) {
                                toastr.success(p.info);
                                sTable.ajax.reload();
                            }
                        })
                    }
                })
            }
        </script>
    </body>
</html>